import { Table, Row, Col, Carousel, Icon } from 'antd';
import { WeaTable,WeaLocaleProvider } from 'ecCom';
const getLabel = WeaLocaleProvider.getLabel;
import { isEqual, isEmpty } from 'lodash';
import { formatData, loadRemind, openLinkUrl } from '../../util/common';
import objectAssign from 'object-assign';
//公司新闻元素
class NewsType extends React.Component {
	constructor(props) {
        super(props);
    }
	shouldComponentUpdate(nextProps, nextState){
		return !isEqual(this.props, nextProps) || !isEqual(this.state, nextState)
    }
	render() {
		const { eid, data, esetting } = this.props;
        const { tabsetting, srcStyle ={} } = data;
        const {autoheight = '0', pictureheight = '108px', picturewidth = '120px', tabid} = srcStyle;
		const list = data.data;
		//tab设置信息
		const { height, width, showModeId, imgs } = tabsetting;
		let columns = new Array;
		let imgStyle = {
			width: width,
			height: height == 0 ? parseInt(width) * 0.8 : height
		}
        let style = {
            verticalAlign: 'top',
            width: picturewidth == 'px' ? '108px' : picturewidth,
            height: pictureheight == 'px' ? '120px': pictureheight
        };
        let listStyle2 = {
            width: '100%',
            height: '100%'
        };
        if(autoheight == '1'){
            imgStyle = {
                verticalAlign: 'top',
                width: picturewidth,
                height: 'auto'
            };
            style = {
                verticalAlign: 'top',
                width: picturewidth,
                height: 'auto'
            };
        }
        if(autoheight == '0' && imgStyle.height && imgStyle.height.indexOf('px')!=-1){
            listStyle2 = {
                width: imgStyle.width,
                height: imgStyle.height
            };
        }
        if(autoheight == '1'){
            imgStyle = {
                verticalAlign: 'top',
                width: picturewidth,
                height: 'auto'
            };
            style = {
                verticalAlign: 'top',
                width: picturewidth,
                height: 'auto'
            };
        }
		let docHtml = '';
		switch (parseInt(showModeId)) {
            case 3: //左图式
                let html = list.map((item, i) => {
                    let imghtml = null;
                    if (!isEmpty(imgs)) {
                        let img = imgs[i];
                        if (typeof img == 'object') {
                            imghtml = <div id={`news_silde_${eid}`} className="news-silde">
                                <Carousel ecId={`${this && this.props && this.props.ecId || ''}_Carousel@4os6mf@${i}`} autoplay >
                                    {img.map(o => {
                                        return <div><ImgCom ecId={`${this && this.props && this.props.ecId || ''}_ImgCom@7ygsjn@${i}`} link={img != '/images/homepage/noimgdefault_wev8.jpg'  && list[i] && list[i].docsubject && list[i].docsubject.link} eid={eid} src={o} style={listStyle2}/></div>
                                    })}
                                </Carousel>
                            </div>
                        } else {
                            imghtml = <ImgCom ecId={`${this && this.props && this.props.ecId || ''}_ImgCom@5uj3r2@${i}`} link={img != '/images/homepage/noimgdefault_wev8.jpg'  && list[i] && list[i].docsubject && list[i].docsubject.link}  eid={eid} src={img}/>
                        }
                    }
                    let style_fs = objectAssign({}, imgStyle, {float:'left', marginBottom: '15px'});
                    let list_new = [];
                    for (var i in item){
                        if(i != 'summary' && i != 'docsubject' && i != 'doccreater'){
                            list_new.push(item[i])
                        }
                    }
                    return <div style={{overflow: 'auto', overflowY: 'hidden', width:'100%',marginBottom:'10px'}}>
                        {!(imgs.length == 1 && imgs[0] == '/images/homepage/noimgdefault_wev8.jpg') && <div style={style_fs}> {imghtml}</div>}
                        <div style={{overflow: 'hidden', paddingLeft: '3px'}}>
                            {
                                item.docsubject ? <div style={{ marginTop: '10px', marginRight: '10px' , marginBottom: '10px'}}>{loadRemind(item.docsubject, esetting.linkmode, esetting.isremind, undefined,undefined,style={ fontFamily: 'PingFangSC-Regular',
                                        fontSize: '14px !important', color: '#333333', letterSpacing: '-0.09px'})}</div>
                                    :<div style={{ marginTop: '10px', marginRight: '10px' , marginBottom: '10px'}}></div>
                            }
                            <div style={{marginBottom:'10px'}}><span style={{width: '99%', overflow: 'hidden', textOverflow: 'ellipsis', WebkitLineClamp: '1',
                                WebkitBoxOrient: 'vertical', display: '-webkit-box',  marginBottom: '10px'}}>{item.summary}</span></div>
                            <div style={{display: 'inline-block', position: 'relative', width: '100%'}}>
                                {item.doccreater ? <div style={{display: 'inline-block' ,marginTop: '10px' , marginRight: '10px' ,marginBottom: '10px'}}>{loadRemind(item.doccreater, esetting.linkmode, esetting.isremind)}</div> : <div style={{display: 'inline-block' ,marginTop: '10px' , marginRight: '10px' ,marginBottom: '10px'}}></div>}
                                <div style={{display: 'inline-block', position: 'absolute', bottom: '15px', float: 'right', width: '100%'}}>
                                    {
                                        list_new.map((item_new) => {
                                            return  <div style={{display: 'inline-block', paddingLeft: '5px', fontSize: '12px', color: '#999999', letterSpacing: '-0.08px'}}>{item_new}</div>
                                        })
                                    }
                                </div>
                            </div>
                        </div>
                    </div>
                });
                docHtml = <div>{html}</div>
                break;
            case 2: //列表式2

                let html4 = null;
                let imghtml = null;
                let imghtml1=[];
                let j=0;
                if (!isEmpty(imgs)) {
                    if (imgs.length > 1) {
                        imgs.map((item,i) =>{
                            if(imgs[i]!='/images/homepage/noimgdefault_wev8.jpg'){
                                imghtml1[j]=imgs[i];
                                j++;
                            }
                        })
                        if(imghtml1.length==0){
                            imghtml1=['/images/homepage/noimgdefault_wev8.jpg'];
                        }
                        let ihtml = imghtml1.map((item, i) => {
                            let img = imghtml1[i];
                            if(!img) img = '/images/homepage/noimgdefault_wev8.jpg';
                            if (img.indexOf("|") !== -1) img = img.split("|")[0];
                            return <div><ImgCom ecId={`${this && this.props && this.props.ecId || ''}_ImgCom@2j08y8@${i}`} link={img != '/images/homepage/noimgdefault_wev8.jpg'  && list[i] && list[i].docsubject && list[i].docsubject.link} style={listStyle2} eid={eid} src={img}/></div>
                        });

                        imghtml = <div id={`news_silde_${eid}`} className="news-silde">
                            <Carousel ecId={`${this && this.props && this.props.ecId || ''}_Carousel@ywib8i`} autoplay>
                                {ihtml}
                            </Carousel>
                        </div>
                    }else{
                        let img = imgs[0];
                        if(!img) img = '/images/homepage/noimgdefault_wev8.jpg';
                        if (img.indexOf("|") !== -1) img = img.split("|")[0];
                        imghtml = <div style={{height: '100%'}} id={`news_silde_${eid}`} className='news-silde'>
                            <Carousel ecId={`${this && this.props && this.props.ecId || ''}_Carousel@n00csk`}>
                                <div><ImgCom ecId={`${this && this.props && this.props.ecId || ''}_ImgCom@5ns0yt`} link={img != '/images/homepage/noimgdefault_wev8.jpg' && list[0] && list[0].docsubject && list[0].docsubject.link} style={listStyle2} eid={eid} src={img}/></div>
                            </Carousel>
                        </div>
                    }
                }
                columns = formatData(list[0], esetting);
                style['paddingTop'] = '6px';
                html4 = <table style={{width: '100%',tableLayout: 'fixed'}}><tr>
                    {
                        <td style={style}>
                            {imghtml}
                        </td>
                    }
                    <td width="*" className="valign"><WeaTable ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@3e6ciy`} columns={columns} showHeader={false} pagination={false} dataSource={list} size="small"/></td>
                </tr></table>;

                docHtml = <div>{html4}</div>
                break;
			case 1: //列表式
			default:
				columns = formatData(list[0], esetting);
				docHtml = <WeaTable ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@06heak`} columns={columns} showHeader={false} pagination={false} dataSource={list} size="small"/>
				break;
		}
        return <div>{docHtml}</div>
	}
}
class ImgCom extends React.Component {
    constructor(props) {
        super(props);
        this.aClick = this.aClick.bind(this);
    }
    aClick () {
        const { link = ''} = this.props;
        if(link != ''){
            window.open(link);
        }else return false;
    }
    render() {
        const {src = '', style = {width: '100%', height: '100%'}} = this.props;
        return (
            <a href="javascript:void(0)" onClick={this.aClick}>
                <img alt="" style={style} src={src}/>
            </a>
        );
    }
}
import { WeaErrorPage, WeaTools } from 'ecCom';
class MyErrorHandler extends React.Component {
    render() {
        const hasErrorMsg = this.props.error && this.props.error !== "";
        return (
            <WeaErrorPage ecId={`${this && this.props && this.props.ecId || ''}_WeaErrorPage@8c84kz`} msg={hasErrorMsg?this.props.error:getLabel(385218,"对不起，该页面异常，请联系管理员！")} />
        );
    }
}
NewsType = WeaTools.tryCatch(React, MyErrorHandler, { error: "" })(NewsType);
export default NewsType;